import React from 'react'
import { NavLink } from 'react-router-dom'

export const Footer = () => (
  <p>
    <NavLink to='/' style={active => ({
      color: active ? 'red' : 'blue'
    })} exact>全部</NavLink>{' '}
    <NavLink to='/active' style={active => ({
      color: active ? 'red' : 'blue'
    })} exact>未完成</NavLink>{' '}
    <NavLink to='/completed' style={active => ({
      color: active ? 'red' : 'blue'
    })} exact>已完成</NavLink>{' '}
  </p>
)
